<html>

<head>
    <title>My first homepage</title>
    <meta charset="utf-8">
    <style>
        #div_1 {
            font-size: 28px;
        }

        #div_1:hover {
            background-color: green;
            transition-delay: 1s;
        }

        #article_2 {
            /* 文字缩进 */
            text-indent: 2em;
            /* 边框 */
            border: 1px solid rgb(19, 18, 18);
            /* 外边距 */
            margin: 1em;
            /* 内边距 */
            padding: 1em 2em 3em 4em;
            /* 行间距 */
            line-height: 41px;
            /* 字符间距 */
            letter-spacing: 2px;
            font-size: inherit;
            /* 文字加粗 */
            font-weight: bold;
            color: darkgoldenrod;
        }

        #article_2:first-line {
            color: firebrick;
        }

        #a_1 {
            text-decoration: overline;
        }

        #a_1:active,
        #a_1:visited {
            font-size: 2em;
        }
    </style>
</head>

<body>
    nihao
    <div id="div_1">
        <blockquote>1</blockquote>
        <hr>
        <article id="article_2">
            println()参数方面，今年Mate 10 Pro使用是新一代徕卡双摄镜头，实力调教，分别是1200万彩色+2000万黑白，F/1.6超大光圈、2倍无损变焦、光学防抖，而且还支持4K视频录制功能。 DxO的评测结论认为，Mate 10 Pro拍照上的主要优点是极佳的曝光，尤其是室内条件下。可能这与大光圈密不可分，营造出一种温和有吸引力的散景效果。
            另外，自动对焦、噪点控制也是令人印象深刻，仅拍照而言，对得起100分。 部分样张：
        </article>
    </div>
    <a href="baidu.com" id="a_1" target="_blank">baidu1</a>
    <a href="baidu.com" target="_parent">baidu2</a>
    <a href="baidu.com" target="_self">baidu3</a>
    <a href="baidu.com" target="_top">baidu4</a>
</body>

</html>